<template>
	<view>
		<scroll-view scroll-y="true" style="height: 100%;" @scrolltolower="scrollToLower1">
			<view class="item" v-for="item in items">
				<view class="content">
					<view class="name">
						姓名: {{item.applyName}}
					</view>
					<view class="name">
						手机号: {{item.applyPhone}}
					</view>
					<view class="name">
						性别: {{item.applySex}}
					</view>
				</view>
			</view>
		</scroll-view>
		<view class="none" v-if="items.length == 0">
			<image src="https://sanfuzhide.oss-cn-hangzhou.aliyuncs.com/vip/%E7%A9%BA%E7%8A%B6%E6%80%81.png"></image>
			<view class="txt">还没有人报名哦</view>	
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return {
				items:[],
				qurey:{
					activityId:'',
					pageNum: 1,
					pageSize: 10
				}
			}
		},
		onLoad(e) {
			this.qurey.activityId = e.id
			this.$get('/activityApply/page',this.qurey).then((res)=>{
				if(res.code == 200){
					this.items = res.data.records
				}
			})
		},
		methods:{
			scrollToLower1(){
				this.qurey.pageNum++
				this.getList()
			},
			getList(){
				this.$get('/activityApply/page',this.qurey).then((res)=>{
					if(res.code == 200){
						this.items = this.items.concat(res.data.records) 
					}
				})
			}
		}
	}
</script>

<style lang="scss">
	.item {
		margin-top: 40rpx;
		width: 690rpx;
		height: 185rpx;
		background: #FFFFFF;
		box-shadow: 0rpx 1rpx 18rpx 0rpx rgba(131, 131, 131, 0.07);
		border-radius: 24rpx;
		padding: 30rpx;
		position: relative;
		.content{
			.name{
				padding-bottom: 10rpx;
			}
		}
		
	}
	.none{
		position: absolute;
		left:50%;
		top:50%;
		transform: translate(-57%,-50%);
		image{
			width: 250rpx;
			height: 250rpx;
		}
		.txt{
			padding-top: 40rpx;
			color: #999999;
			font-size: 24rpx;
			display: flex;
			justify-content: center;
		}
	}
</style>
